<template>
	<view>
		<!-- <cl-card :label="company"  :more-text="_express_no">
			<cl-timeline>
				<cl-timeline-item
					v-for="(item, index) in list"
					:key="index"
					:timestamp="item.time"
					:content="item.context"
				></cl-timeline-item>
			</cl-timeline>
		</cl-card> -->
		<!-- 快递 -->
		<view class="kuaidi">
			<view>
				<image :src="show_img" mode=""></image>
			</view>
			<view class="kdgs">
				<view class="" v-if="express_com=='HTKY'">百世快递</view>
				<view class="" v-if="express_com=='STO'">申通快递</view>
				<view class="" v-if="express_com=='YTO'">圆通速递</view>
				<view class="" v-if="express_com=='HHTT'">天天快递</view>
				<view>包裹：</view>
			</view>
			<view>{{express_no}}</view>
		</view>
		<!-- 订单编号 -->
		<view class="orderList">
			<view style="transform: rotateY(0.5turn);padding: 5upx 10upx;">
				<u-icon name="car" color="#7c7c7c" size="32"></u-icon>
			</view>	
			<view>
				<view class="order_list">
					订单编号：{{detaillist.order_sn}}
				</view>
				<view class="order_list">
					收货地址：{{addr.addr_text}}{{addr.detail}}
				</view>
			</view>	
		</view>
		<!-- 物流信息 -->
		<view>
			<u-steps current="1" direction="column">
				<u-steps-item title="已下单" desc="10:30">
				</u-steps-item>
				<u-steps-item title="已出库" desc="10:35">
				</u-steps-item>
				<u-steps-item title="运输中" desc="11:40"></u-steps-item>
			</u-steps>
		</view>
		
	</view>
</template>

<script>
	import { timeForm } from '@/utils/TimeFrom.js'; //时间戳转为日期
	export default{
		data(){
			return{
				list:[],
				token:'',
				detaillist:{},//详情
				addr:{},//收货地址
				order_id:'',//订单id
				express_com:'',//物流公司
				express_no:'',//物流单号
				up_time:'',//支付时间 /提交订单的时间
				show_img:'',//显示的图片
				host: 'https://4de16698-d9f4-443a-b416-ef1037cce952.bspapp.com/http'
			}
		},
		onLoad(options) {
			// console.log(options);
			this.order_id=options.order_id;
		},
		mounted() {
			this.orderdetail()
		},
		methods:{
			// 订单详情
			orderdetail(){
				let token = uni.getStorageSync('token');
				this.token = token;
				let uid = uni.getStorageSync('uid');
				this.uid = uid;
				uni.request({
					method: 'POST',
					header: {
						'token': this.token
					},
					data: {
						uid:this.uid,
						orderId:this.order_id
					},
					url: this.host + '/order/getOrderDetail',
					success: res => {
						// console.log(res);
						this.detaillist={...res.data.data[0]}
						
						console.log(this.detaillist);
						this.addr=this.detaillist.address
						this.express_com=this.detaillist.express_com
						this.express_no=this.detaillist.express_no
						this.show_img=this.detaillist.goods[0].img
						this.up_time = timeForm(this.detaillist.update_time, false, this.now);
						this.wuliu()
					},
					fail: () => {
						console.log('请求失败');
					}
				});
			},
			// 物流信息
			wuliu(){
				let token = uni.getStorageSync('token');
				this.token = token;
				uni.request({
					method: 'POST',
					header: {
						'token': this.token
					},
					data: {
						express_com:this.express_com,//快递公司编码 
						express_no:this.express_no //快递号
					},
					url: this.host + '/order/wuliu',
					success: res => {
						console.log(res);
						console.log(res.data.data.data);
						console.log(res.data.data.headers);
					},
					fail: () => {
						console.log('请求失败');
					}
				});
			}
			
		}
	}
</script>

<style lang="scss">
	.kuaidi{
		height: 120upx;
		line-height: 80upx;
		display: flex;
		padding: 20upx 0;
		margin: 0 20upx;
		border-bottom: 1px solid #e8e8e8;
		view{
			font-size:28upx;
			image{
				width: 80upx;
				height: 80upx;
				box-shadow: 0 0 6upx 1upx #e8e8e8;
			}
		}
		.kdgs{
			color: #23b411;
			display: flex;
			padding-left: 10upx;  
		}
	}
	.orderList{
		display: flex;
		padding: 20upx 0;
		margin: 0 20upx;
		border-bottom: 1px solid #e8e8e8;
		font-size:28upx;
		.order_list{
			display: flex;
		}
	}

</style>
